<!--  -->
<template>
    <div id="showpop">

        <!-- navBar -->
        <div class="nav bg-theme color-f text-l">
            <div style="display:flex;flex:2;">
                <!-- 返回按钮 -->
                <i class="iconfont icon-fanhui font19 pl08 iback" @click="gotoMobile()"></i>
                <!-- 标题 -->
                <span class="font19 ml16">
                    {{ pagename }}
                </span>
            </div>
            <!-- 起草 -->
            <span v-if='hasCreatIcon' style="margin-right:10px;margin-left:10px">
                <van-icon @click="todraw" name="add-o" size="25" />
            </span>
        </div>
        
        <div class="pageview">
            <!-- 动态组件 -->
            <component :is="tabviewName" ref="searchdata" style="height:calc(100vh-50px)"></component>
            <!-- Tabbar -->
            <!-- <van-tabbar v-model="active" @change="onchange">
                <van-tabbar-item>
                    <span>我的工作</span>
                    <template #icon="props">
                        <img :src="props.active ? icon1.active : icon1.inactive">
                    </template>
                </van-tabbar-item>

                <van-tabbar-item>
                    <span>报表统计</span>
                    <template #icon="props">
                        <img :src="props.active ? icon2.active : icon2.inactive">
                    </template>
                </van-tabbar-item>
            </van-tabbar> -->
        </div>
        <!-- 起草菜单弹窗 -->
        <van-popup v-model="showZSDrawPopup" position="bottom" get-container="#showpop">
            <van-picker
              visible-item-count="6"
              show-toolbar
              :columns="zsDrawColumns"
              @confirm="showZSDrawPopupConfirm"
              @cancel="showZSDrawPopup = false"
            />
        </van-popup>    
    </div>
</template>


<script type="text/javascript">
import tabview0 from '@/views/zstabview/todoview'
import tabview1 from '@/views/zstabview/fromview'
import { mapGetters } from 'vuex'
import moment from 'moment'
import {getMenuInfo } from "@/api/zsapi";
import { Toast ,Notify} from 'vant'
export default {

    data() {
        return {
            
            pagename: '党建助手服务平台-我的工作',
            tabviewName: '',
            active: 0,
            icon1: {
                active: require('@/assets/images/home_checked.png'),
                inactive: require('@/assets/images/home.png')
            },
            icon2: {
                active: require('@/assets/images/zcxj_selected.png'),
                inactive: require('@/assets/images/zcxj.png')
            },
            showToDoDialog: false,
            showTZDialog: false, //
            nowDate: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()),
            strDate: new Date(new Date().getFullYear() - 10, new Date().getMonth(), new Date().getDate()),
            maxDate: new Date(new Date().getFullYear() + 10, new Date().getMonth(), new Date().getDate()),
            showstrdialog: false,
            strtimeval: '',
            showenddialog: false,
            endtimeval: '',
            taizhangTitle: '',
            hasCreatIcon: false,
            hasCreat: true,
            zsDrawColumns:[],
            menuList:[],
            showZSDrawPopup:false
        }
    },

    computed: {
        ...mapGetters(['user']),
    },

    /// 生命周期--创建完成
    created() {
        
    },

    components: {
        tabview0,
        tabview1
    },

    /// 生命周期--挂载完成
    mounted() {

        if (window.history && window.history.pushState) {
            
            history.pushState(null, null, document.URL);
            window.addEventListener('popstate', this.gotoMobile, false);//false阻止默认事件
        }

        var hasTabbarNumber = (localStorage.getItem('zsTabbarNumber') != '' &&
            localStorage.getItem('zsTabbarNumber'));
        this.active = localStorage.getItem('zsTabbarNumber')

        // if (hasTabbarNumber && this.active == 1) {

        //     localStorage.setItem('zsTabbarNumber', 1)
        //     this.tabviewName = 'tabview1'
        //     this.pagename = '党建助手服务平台-报表统计'
        //     this.active = 1;
        //     this.hasCreatIcon = false
        // }
        // else
        // {
            localStorage.setItem('zsTabbarNumber', 0)
            this.tabviewName = 'tabview0'
            this.pagename = '党建助手服务平台-我的工作'
            this.active = 0;
            if (this.hasCreat) {
                this.hasCreatIcon = true
            }
        // }
    },

    //方法调用
    methods: {
        onchange(index) {
            if (index == 0) {
                localStorage.setItem('zsTabbarNumber', 0)
                this.tabviewName = 'tabview0'
                this.pagename = '党建助手服务平台-我的工作'
                this.active = 0
                this.hasCreatIcon = true
            } 
            else if (index = 1) {
                localStorage.setItem('zsTabbarNumber', 1)
                this.tabviewName = 'tabview1'
                this.pagename = '党建助手服务平台-报表统计'
                this.active = 1
                if (this.hasCreat) {
                    this.hasCreatIcon = false
                }
            }
        },

        gotoMobile() {

            this.addlistener();
            if (this.active == 0 && this.showToDoDialog) {
                this.showToDoDialog = false;
            } 
            else if (this.active == 1 && this.showTZDialog) {

                if (this.showstrdialog) {
                    this.showstrdialog = false;
                    return;
                }

                if (this.showenddialog) {
                    this.showenddialog = false;
                    return;
                }

                this.showTZDialog = false;
            } 
            else 
            {
                localStorage.setItem('zsTabbarNumber', 0)
                localStorage.setItem('tabactiveNumber', '')
                this.$router.push(
                    {
                        name: 'mainview',
                        query: {
                        }
                    }
                )
            }
        },

        /// 注册 返回键
        addlistener() {
            if (window.history && window.history.pushState) {
                console.log('再次注册物理返回键监听');
                history.pushState(null, null, document.URL);
                window.addEventListener('popstate', this.gotoMobile, false);//false阻止默认事件
            }
        },
        todraw(){
          Toast.loading({
            message: "加载中...",
            forbidClick: false,
          });
          getMenuInfo(Object.assign({userName:this.user.userName}))
            .then((res)=>{
              Toast.clear();
              if(!res.data){
                Notify(res.message);
                return;
              }
              this.zsDrawColumns=[];
              this.menuList=[];
              for(var i=0;i<res.data.data.length;i++){
                if(res.data.data[i].id=='djzs-006'){//省公司任务派发 1
                  this.zsDrawColumns.push(res.data.data[i].remark);
                  this.menuList.push(res.data.data[i].id);
                }else if(res.data.data[i].id=='djzs-017'){//公司本部任务派发 3
                  this.zsDrawColumns.push(res.data.data[i].remark);
                  this.menuList.push(res.data.data[i].id);
                }else if(res.data.data[i].id=='djzs-007'){ //分公司任务派发 2
                  this.zsDrawColumns.push(res.data.data[i].remark);
                  this.menuList.push(res.data.data[i].id);
                }
              }
              if(this.zsDrawColumns.length>1){
                this.showZSDrawPopup=true;  
              }else if(this.zsDrawColumns.length>0){
                var disType=''
                var drawName=''
                if(this.menuList[0]=='djzs-017'){//公司本部任务派发
                  disType='3'
                  drawName=this.zsDrawColumns[0]
                }else if(this.menuList[0]=='djzs-007'){ //分公司任务派发
                  disType='2'
                  drawName=this.zsDrawColumns[0]
                }else if(this.menuList[0]=='djzs-006'){ //省公司任务派发
                  disType='1'
                  drawName=this.zsDrawColumns[0]
                }
                this.$router.push({
                  name:'zsdetailview',
                  query:{
                      isdraw:'1',
                      disType:disType,
                      drawName:drawName
                  }
                })  
              }else {
                Notify({ type: 'warning', message: '获取起草菜单失败,请稍后重试' })
              }
            })
            .catch((error) => {
              Toast.clear();
              Notify({ type: 'warning', message: '获取数据失败,请稍后重试' })
            });
         
        },
        showZSDrawPopupConfirm(value,index){
          this.showZSDrawPopup=false
          var disType='1'
          var getOrgType='0'
          console.log("aaaaaaaaaa"+this.menuList[index])
          if(this.menuList[index]=='djzs-006'){ //省公司任务派发
            getOrgType='1'
          }else{
            disType='3'
          }
          this.$router.push({
            name:'zsdetailview',
            query:{
                isdraw:'1',
                disType:disType,
                drawName:value,
                getOrgType:getOrgType
            }
          })  
        }
    },

    destroyed() {
        window.removeEventListener('popstate', this.gotoMobile, false);//false阻止默认事件
    },
}

</script>



<style scoped>

/* @import url();*/
.item {
    text-align: center;
    width: 20%
}

.pageview {
    height: 100%;
    padding-top: 50px;
    margin-bottom: 60px;
    font-size: 12px;
}

.tabview {
    position: fixed;
    bottom: 0;
    width: 100%;
    line-height: var(--footer-height);
    background-color: gray;
    padding-top: 20px;
    padding-bottom: 20px;
}

.vh100 {
    width: 100%;
}

.pf-20 {
    padding-right: 20px;
}

</style>